/*报名记录 详情页*/
<template>
    <div class="personalInformation background" :style="{height: `${screenHeight}px`}">
        <mt-field :readonly="true" label="姓名" type="text" v-model="nickName"></mt-field>
        <mt-field :readonly="true" label="年龄" type="text" v-model="age"></mt-field>
        <mt-field :readonly="true" label="手机号" type="text" v-model="mobile"></mt-field>
        <mt-field :readonly="true" label="总付款" type="text" v-model="cost"></mt-field>
        <mt-field :readonly="true" label="报名时间" type="text" v-model="createTime"></mt-field>
        <mt-field style="margin-top:5px;" :readonly="true" label="备注说明" type="textarea" rows="4" v-model="remark"></mt-field>
    </div>
</template>

<script>
import { recordInfo } from '@/api/request.js';
import { Field } from 'mint-ui'; //滚动组件
import { getStore  } from '@/assets/js/utils.js';

export default {
  name: 'personalInformation',
  data() {
    return {
        nickName:'',
        age:'',
        mobile:'',
        cost:0,
        createTime:'',
        remark:''
    }
  },
   computed: {
      screenHeight () {
        return window.innerHeight-40;
      }
  },
  created(){
    let userId = getStore('userId');
    let user = getStore('user');
    if(!userId || !user){
      this.$router.push('/wxLogin')
    }
    if(this.$route.params.id){
      this._recordInfo(this.$route.params.id);
    }else{
      this.$router.push('/')
    }
  },
  mounted() {
    this.$store.commit('UPDATE_PAGE_TITLE', '数据信息')
    this.$store.commit('UPDATE_FOOTER', false)
  },
  methods: {
      //获取报名人详情数据
      _recordInfo(id){
        let that = this;
          recordInfo(id).then(res => {
            if (res.code == 1) {
              console.log('报名人详情数据',res.data)
              that.nickName = res.data.registrationUser.nickName || '';
              that.age = res.data.registrationUser.age || '';
              that.mobile = res.data.registrationUser.mobile || '';
              that.cost = res.data.registration.cost || '';
              that.createTime = res.data.createTime || '';
              that.remark = res.data.remark || '';
            }
          }).catch(err => console.log(err))
      }

  },
  components: {
      "mt-field":Field
  }
}
</script>
<style scoped lang="scss">
.personalInformation{
    margin-top: 40px;
}

</style>